
//- This source code is licensed under the terms of the
//- GNU Affero General Public License found in the LICENSE file in
//- the root directory of this source tree.
//-
//- Copyright (c) 2021-present Kaleidos INC

doctype html

div.wrapper(
    ng-controller="EpicDetailController as ctrl",
    ng-init="section='epics'"
)
    tg-project-menu

    div.main.detail
        .detail-header-container(ng-class="{blocked: epic.is_blocked}")
            tg-detail-nav(item="epic")
            .detail-header
                tg-detail-header(
                    item="epic"
                    section-name="sectionName"
                    project="project"
                    required-perm="modify_epic"
                    ng-if="project && epic"
                    format="text"
                )
                .epic-selector
                    span.epic-selector-text {{'EPIC.EPIC_COLOR' | translate}}
                    tg-color-selector.color-selector(
                        is-color-required="true"
                        init-color="epic.color"
                        on-select-color="ctrl.onSelectColor(color)"
                        required-perm="modify_epic"
                    )
                .subheader
                    tg-tag-line.tags-block(
                        ng-if="epic && project"
                        project="project"
                        item="epic"
                        permissions="modify_epic"
                    )
                    tg-created-by-display.ticket-created-by(ng-model="epic")


        .detail-content(ng-if="attachmentsReady")
            section.duty-content
                tg-item-wysiwyg(
                    type="epic",
                    model="epic",
                    required-perm="modify_epic"
                )

            // Custom Fields
            tg-custom-attributes-values(
                ng-model="epic"
                type="epic"
                project="project"
                required-edition-perm="modify_epic"
            )

            tg-attachments-full(
                obj-id="epic.id"
                type="epic",
                project-id="projectId"
                edit-permission = "modify_epic"
            )

            tg-related-userstories(
                project="immutableProject"
                userstories="userstories"
                epic="immutableEpic"
            )

            tg-history-section(
                ng-if="epic"
                type="epic"
                name="epic"
                id="epic.id"
                project="project"
            )

    sidebar.sidebar.ticket-data

        section.ticket-header
            span.ticket-title(
                tg-epic-status-display
                ng-model="epic"
            )
            span.detail-status(
                tg-epic-status-button
                ng-model="epic"
            )

        section.ticket-section.ticket-assigned-to(
            tg-assigned-to
            ng-model="epic"
            required-perm="modify_epic"
        )

        section.ticket-section.ticket-watchers(
            tg-watchers
            item="epic"
            active-users="activeUsers"
            on-watch="ctrl.onWatch"
            on-unwatch="ctrl.onUnwatch"
            required-perm="modify_epic"
        )

        section.ticket-section.ticket-detail-settings
            tg-us-team-requirement-button(ng-model="epic")
            tg-us-client-requirement-button(ng-model="epic")
            tg-block-button(
                tg-check-permission="modify_epic",
                ng-model="epic"
            )
            tg-delete-button(
                tg-check-permission="delete_epic",
                on-delete-title="{{'EPIC.ACTION_DELETE' | translate}}",
                on-delete-go-to-url="onDeleteGoToUrl",
                ng-model="epic"
            )

    div.lightbox.lightbox-block(tg-lb-block, ng-model="epic", title="EPIC.LIGHTBOX_TITLE_BLOKING_EPIC")
